<template>
  <div class="back-to-father">
    <div class="icon" @click="goBack">
      <img src="../../../static/img/arrow_left@3x.png" alt="">
    </div>
    <p class="title">{{title}}</p>
  </div>
</template>

<script type="text/ecmascript-6">

export default {
  props: [
    'title'
  ],
  data () {
    return {
    }
  },
  methods: {
    goBack () {
      this.$router.go(-1)
    }
  }
}
</script>

<style  scoped lang="stylus" rel="stylesheet/stylus">
  .back-to-father
    position: relative
    width: 100%
    height: 44px
    background-color: #fff
    border-bottom: 1px solid #f4f4f4
    .icon
      position: absolute
      top: 50%
      margin-top: -6px
      left: 20px
      width: 12px
      height: 11px
      border: 1px solid 1px solid red
      img
        width 100%
    .title
      font-size: 14px
      font-weight: 600
      color: #333
</style>